﻿<%@ page pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
    <head>
    	<!-- Meta -->
        <meta charset="utf-8"/>
        <title>Oublie Mots de passe</title>
        
        <!-- CSS -->
        <link rel="stylesheet" href="medias/css/form.css" type="text/css" media="screen"/>
		
		<!-- JQuery -->
		<meta name="viewport" content="width=device-width, initial-scale=1"/> 
		<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css"/>
		<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
		<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
    </head>
    
    <body>
    	<div data-role="page">
    	
			<div data-role="header">
            	<div id="banniere">
                	<br/> <br/>
                    <h1 >CrecheBook</h1>
                </div>
                <div id="searchBox">
        			<div class="ui-bar ui-bar-c">        
                    	<a href='search.jsp' rel='external' data-role='button' data-theme='c' data-corners='true' data-icon='home' data-inline='true'>Accueil</a>
                        <h2>Mots de passe oubliés</h2>
                    </div>
                </div>
            </div>
			
			<div data-role="content">
		        <form method="post" action="mail" data-ajax="false">
		            <fieldset>
		                <legend>Email</legend>
		                <p>Entrez votre email et récupérez vos identifiants dans votre boite mail</p>
		                <br/> <br/>
		 
		                <label for="email">Adresse email <span class="requis">*</span></label>
		                <div class="ui-grid-a" style="margin-top:-5px;">
		                	<div class="ui-block-a" style="height:50px;">
		                		<input type="email" id="email" name="email" value="<c:out value="${admin.email}"/>" maxlength="60"/>
			                </div>
		                	<div class="ui-block-b" style="height:50px;padding-top:18px;text-align:center;font-size:14px;">
	                			<span class="erreur">${mail.erreurs['email']}</span>
	                		</div>
		                </div>
		                <br/>
		                
		                <div style="width:250px;height:50px;margin:auto;">
		                	<input type="submit" value="Envoyer" data-theme="b"/>
		                </div>
		                <br/>
		                
		                <p class="${empty mail.erreurs ? 'succes' : 'erreur'}" align="center" style="font-size:14px;">
		                	${mail.resultat}
		                </p>
		            </fieldset>
		        </form>
	        </div>
	        
			<div data-role="footer">
				<h4 style="margin:30px;">
					<strong> CrecheBook 2013 </strong> <br/>
					<a href="legal.jsp" data-ajax="false">Mentions&nbsp;l&eacute;gales</a>&nbsp;|&nbsp;
					<a href="connexion" data-ajax="false">Administateur</a>
				</h4>
			</div>
			
		</div>
		
		<script type="text/javascript">
			if (document.getElementById('email').value == 'key') {
				document.getElementById('email').value = '';
			}
		</script>
    </body>
</html>